<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>我的收藏</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<meta name="description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.
">
<link rel="stylesheet" href="resources/css/weui.min.css">
<link rel="stylesheet" href="resources/css/jquery-weui.css">
<link rel="stylesheet" href="resources/css/style.css">
<link rel="stylesheet" href="resources/css/custom.css">
</head>
<body ontouchstart v-cloak>
<!--顶部搜索-->
<header class="wy-header">
  <div class="wy-header-icon-back"><span></span></div>
  <div class="wy-header-title">我的收藏</div>
</header>
<!--主体-->
<div class="weui-content">
  <div class='proListWrap'>
    <div class="pro-items" v-for="(list,id) in wishList">
      <div class="weui-media-box weui-media-box_appmsg">
        <div class="weui-media-box__hd"><a href="#pro_info.html"><img class="weui-media-box__thumb" v-lazy="list.defaultImg"></a></div>
        <div class="weui-media-box__bd">
          <h1 class="weui-media-box__desc"><a href="#pro_info.html" class="ord-pro-link">{{ list.name }}</a></h1>
          <div class="wy-pro-pri">¥<em class="num font-15">{{ list.price }}</em></div>
          <ul class="weui-media-box__info prolist-ul">
            <li class="weui-media-box__info__meta"><a href="javascript:;" @click="del(list.productId,id)" class="wy-dele"></a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>



<script src="resources/js/jquery.min.js"></script>
<script src="resources/js/fastclick.js"></script> 
<script src="resources/js/jquery-weui.min.js"></script>  
<!-- 引入vue -->
<!-- 生产环境版本，优化了尺寸和速度 -->
<!-- 
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
<script src="resources/js/vue@2.6.12"></script>
 -->
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<!-- 
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
 -->
<script src="resources/js/vue.js"></script>
<script src="resources/js/vue-lazyload.js"></script>
<script type="text/javascript">
    // vue懒加载
    Vue.use(VueLazyload)
    // vue管理
    new Vue({
        el:'.proListWrap',
        data:{
        	wishList:[]
        },
        methods:{
        	del(productId,id){
                $.post('api/v1/user/remove/wishlist',{id:productId},({errorCode})=>{
                	if(errorCode==0){this.wishList.splice(id,1);}
                	else{location.reload();}
                });
            }
        },
        // 组件挂载完毕
        mounted() {
                //获取收藏列表
                $.post('api/v1/user/wishlist',{id:245},(result)=>{
        			this.wishList = result.wishList.product;
    			});
                $(function() {
                    // 显示
                    $("body").removeAttr("v-cloak");
                    // fastclick
                    FastClick.attach(document.body);
                });
        },
    });
</script>
</body>
</html>
